<template>
	<el-dialog title="客户订单列表" center v-model="dialogTableVisible1" append-to-body @close="close">
		<el-table v-loading="loading" :data="list" style="width: 100%;"
			:header-row-style="{background:'#FAFAFA',color:'#0C1019',height:'54px'}" :cell-style="{height:'54px'}"
			highlight-current-row
			@current-change="handleSelectionChange1"
			ref="singleTable"
			>
			<el-table-column label="选择订单" align="center">
				<template #default="scope">
					<el-radio v-model="orderMes.id" :label="scope.row.id">{{''}}</el-radio> 
				</template>
			</el-table-column>
			<el-table-column label="订单编号" align="center" prop="orderNumber">
				<template #default="scope">
					<span class="main-color cursor" @click="detail(scope.row)">{{scope.row.orderNumber}}</span>
				</template>
			</el-table-column>
			<el-table-column label="客户姓名" align="center">
				<template #default="scope">
					<span class="main-color">{{scope.row.customerName}}</span>
				</template>
			</el-table-column>
			<el-table-column label="审批状态" align="center">
				<template v-slot="scope">
					<div class="flex col-center row-center"
					:class="activeStatus(scope.row.orderStatus)"
					>
						<span class="drop"></span>
						<dict-tag :options="bus_order_status" :value="scope.row.orderStatus" />
					</div>
				</template>
			</el-table-column>
			<el-table-column label="创建日期" align="center" prop="createTime"/>
		</el-table>
		<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
			v-model:limit="queryParams.pageSize" @pagination="getList" />
		<div slot="footer" class="dialog-footer text-right mt30">
			<el-button class="cancelSubBtn" @click="close()">取 消</el-button>
			<el-button type="primary" @click="orderSubmit()" class="mainSubBtn">确 定</el-button>
		</div>
	</el-dialog>
</template>

<script>
	//订单列表
	import {
		orderList,
	} from "@/api/business/order";
	export default {
		props:{
			customerId:{
				type:String,
				default:''
			}
		},
		data() {
			return {
				loading: true, // 遮罩层
				list: [],
				dialogTableVisible1: false,
				multiple: true, // 非多个禁用
				total: 0, // 总条数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					customerId:''
				}, //查询参数
				id:'',
				bus_order_status: this.useDict('bus_order_status').bus_order_status,
				orderMes:{
					id:'',
					name:''
				}
			}
		},
		created() {
			
		},
		methods: {
			//详情
			detail(row){
				window.open('/order/orderDetail?orderNumber='+row.orderNumber+'&type=0', '_blank');
			},
			open() {
				this.dialogTableVisible1 = true
				this.queryParams.customerId = this.customerId
				this.getList()
			},
			close() {
				this.dialogTableVisible1 = false
			},
			//查询列表
			getList() {
				this.loading = true;
				// this.queryParams.customerId = this.customerId
				orderList(this.queryParams).then((response) => {
					this.list = response.rows
					this.total = response.total;
					this.loading = false;
				});
			},
			// 单选框选中数据
			handleSelectionChange1(val) {
				console.log(val,'val')
				if(val){
					this.orderMes = {
						id:val.id,
						orderNumber:val.orderNumber
					}
				}
			},
			orderSubmit() {
				this.$emit('orderFunc', this.orderMes)
			}
		}
	}
</script>

<style>
</style>